<template>
	<view style="height: 100%;">
		<view class="centent">
			<view class="bottombox" v-for="(item,index) in gglist" :key="index" @tap="toget(item.imid)"
				v-if="gglist.length>0">
				<view class="bottomcenter">
					<view class="usershenfen">
						<text>{{item.nickname}}</text>
						<text v-if="item.zhiwei">【{{item.zhiwei}}】</text>
						<text v-if="item.guanxi">【{{item.guanxi}}】</text>
						<text class="bzr" v-if="item.bzr==1">班主任</text>
					</view>
				</view>
			</view>
			<kongyemian v-if="gglist.length<1" type="shujv" :isLoding="loding"></kongyemian>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapGetters,
		mapMutation,
		mapActions
	} from 'vuex';
	export default {
		computed: {
			...mapState({
				userInfo: state => state.user.userInfo,
				isLogin: state => state.user.isLogin
			})
		},
		data() {
			return {
				school_id: 0,
				gglist: [],
				index: 0,
				class_id: 0,
				loding:true
			}
		},
		methods: {

			tongxunlushow() {
				this.loding = true
				this.$store
					.dispatch('tongxunlushow', {
						openid: this.userInfo.openid,
						index: this.index,
						class_id: this.class_id

					})
					.then(res => {
						if(res.data.code==1){
							this.gglist = res.data.data;
						} else{
							this.gglist = []
							uni.showToast({
								title: res.data.msg,
								icon: "none",
							})
						}
						
						this.loding = false
					});
			},
			toget(imid) {

				uni.navigateTo({
					url: "../conversationDt/conversationDt?cvid=C2C" + imid + '&toImId=' + imid
				})
			}


		},
		onLoad() {

			this.index = uni.getStorageSync("def")
			this.class_id = uni.getStorageSync("class_id")			
			this.tongxunlushow()

		},
		onPullDownRefresh() {
			this.tongxunlushow()
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 1500)
		}
		
	}
</script>

<style lang="less">
	page {
		height: 100%;
		background-color: #f4f4f4;
		box-sizing: border-box;

	}

	.centent {
		background-image: url(../../static/keding.png);
		background-size: 100% auto;
		background-repeat: no-repeat;
		width: 100%;
		height: 100%;
		padding-top: 40rpx;

		.bottombox {
			padding: 10rpx 20rpx;
			width: 100%;
			height: 165rpx;
			box-sizing: border-box;

			.bottomcenter {
				position: relative;
				width: 100%;
				height: 100%;
				background-color: #fff;
				border-radius: 15rpx;
				box-shadow: 0rpx 4rpx 17rpx 4rpx rgba(188, 225, 237, 0.35);
				box-sizing: border-box;
				display: flex;
				justify-content: start;
				align-items: center;
				padding-left: 20rpx;

				.usershenfen {
					font-size: 28rpx;
					color: #000000;

					.bzr {
						padding: 5rpx 20rpx;
						border-radius: 10rpx;
						background-color: #0a98f7;
						color: #fff;
						font-size: 25rpx;
						margin-left: 10rpx;
					}
				}



			}
		}

	}
</style>
